{extend name='public/content'}

{block name="title"}
	门店商品展示
{/block}

{block name="body"}
	<div class="layui-container"  ng-app="myApp" ng-controller="myCtrl"> 	
		<a href="{:url('index/index')}">商城首页</a>
		<input type="text" ng-model="msg" ng-init="msg=''"><div class="layui-btn" ng-click="serch()">搜索</div>
		<div class="layui-container">  
			<div class="layui-container">  
			  <div class="layui-row">
			    <div class="layui-col-xs6 layui-col-sm6 layui-col-md4" ng-repeat="x in catage">
			     	<span class="layui-btn" ng-bind="x.title" ng-click="catageg(x)"></span>	
			    </div>
			  </div>
			</div>
			<div>{$storeid}</div>
			<a href="{:url('work/index')}?storeid={$storeid}">客服</a>
			<div class="layui-row" style="height: 200px" ng-repeat="x in data">
			    <a href="{:url('index/goods')}?id={{x.id}}&storeid={$storeid}">商品详情
				    <div class="layui-col-md3">
				    	<img style="width: 100px;height: 100px" ng-src="{{x.logo}}">
				    </div>
				    <div class="layui-col-md3" >
				    	 {{x.name}} {{x.price}}
				    </div>
				    <div class="layui-col-md3" ng-bind-html="x.detail | trustHtml">
				    </div>
				    <div class="layui-col-md3" ng-bind="x.view">
				    </div>
				</a>
			</div>
		</div>	
	</div>
{/block}

{block name="script"}
<script type="text/javascript">
	require(['jquery','angular'], function () { 
		angular.module('myApp', [])
			.service('$factory',function($http){
				var locg={
		   			serch:function(data,call){
		   				var url ="{:url('index/serch')}";
	                 	$http.get(url,{params:data}).then(function(res){call(res)})	
		   			},
		   			param:function(page,limit,storeid,msg,catge){
		   				let data ={
		   					page:page,
		   					limit:limit,
		   					storeid:storeid,
		   					msg:msg,
		   					catge:catge
		   				}
		   				return data; 
		   			},
		   			goodscatage:function(call){
		   			 	var url ="{:url('index/index/goodscatage')}";
		   			 	$http.get(url,{}).then(function(res){call(res)})
		   			}	
		   		}
		   		return locg;
			})
			.controller('myCtrl', function($scope, $http,$factory) {
				var storeid = "{$storeid}";
				$scope.page  =  1;
				$scope.catge  =  '';
				$scope.limit =  10;
				$scope.storeid =  storeid;
				$scope.msg = ''; 
				$scope.params = $factory.param($scope.page,$scope.limit,$scope.storeid,$scope.msg,$scope.catge);
				$factory.serch($scope.params,function(data){
					$scope.data=data.data;
				})
				$factory.goodscatage(function(data){
					$scope.catage=data.data;
					console.log(data);

				})
				$scope.serch=function(){
					$scope.params= $factory.param($scope.page,$scope.limit,$scope.storeid,$scope.msg,$scope.catge);	
					$factory.serch($scope.params,function(data){
						$scope.data = data.data;
					})
				}
				$scope.catageg=function(x){
					$scope.msg='';
					$scope.catge = x.id;
					$scope.params= $factory.param($scope.page,$scope.limit,$scope.storeid,$scope.msg,$scope.catge);	
					$factory.serch($scope.params,function(data){
						$scope.data=data.data;
					})
				}
				$scope.$watch('msg',  function(newValue, oldValue) {
					console.log(newValue+"-----------"+oldValue);
		            if (newValue!=oldValue) { 
		            	$scope.params= $factory.param($scope.page,$scope.limit,$scope.storeid,$scope.msg,$scope.catge);
		            	$factory.serch($scope.params,function(data){
							$scope.data=data.data;
						})
		            } 
			     });
			})
			.filter('trustHtml', function ($sce) {
		        return function (input) {
		            return $sce.trustAsHtml(input);
		        }
		    });
	})
</script>
{/block}

{block name="style"}
 <style type="text/css">

 </style>
{/block}
